<template>
	<div>

		<div class="row">
			<div class="col-lg-12">
				<div class="panel">
					<div class="panel-heading bk-bg-primary">
						<h6><i class="fa fa-table red"></i><span class="break"></span>帐号管理</h6>
					</div>

					<div class="panel-body">
						<div class="table-responsive">
							<table class="table table-striped table-bordered bootstrap-datatable datatable">
								<thead>
								<tr>
									<th>登录帐号</th>
									<th>公司名称</th>
									<th>联系人</th>
									<th>联系电话</th>
									<th>邮箱</th>
									<th>日期</th>
									<th>备注</th>
									<th>操作</th>
								</tr>
								</thead>
								<tbody>
								<tr v-for="(items, index) in agentList.result">
									<td>{{ items.username }}</td>
									<td>{{ items.company }}</td>
									<td>{{ items.description }}</td>
									<td>{{ items.phone }}</td>
									<td>{{ items.email }}</td>
									<td>{{ items.registration }}</td>
									<td>{{ items.remarks }}</td>
									<td>
										<a class="label label-warning" @click="accountCol(items.username)">{{ items.status == 'A' ? '冻结':'开启' }}</a>
									</td>
								</tr>
								</tbody>
							</table>
						</div>
					</div>
				</div>
			</div>

			<lsc-page
							mode="event"
							:totalPage="pages"
							:init-page="eventPage"
							:eventFunt="eventFunt"
							@go-page="goPage"></lsc-page>
		</div>

	</div>
</template>
<script>

	import LscPage from '../../components/page_list.vue'
	import {mapGetters} from 'vuex'

	export default{
		name: 'home',
		computed: {
			...mapGetters({
				navStatus: 'getNavStatus',
				agentList: 'getAgentList'
			}),
			pages () {
				if(this.agentList.pageInfo){
					return this.agentList.pageInfo.totalPage
				}
			}
		},
		data () {
			return {
				eventPage: 1,
				eventFunt: 'fetchAgent',
			}
		},
		methods: {
			goPage (data) {
				this.eventPage = data.page
			},

			accountCol (username) {
				this.$store.dispatch('fetchGeustAccountDel', {username: username})
			}
		},
		mounted () {

			this.$store.dispatch('fetchAgent', {page: 1})


		},
		components: {
			LscPage
		},
		watch: {
			agentList (newVal) {
				this.eventPage = newVal.pageInfo.pageIndex
			}
		}
	}


</script>

<style>
	.order-set {
		padding: 0 20px 20px 20px;
	}
</style>
